<!doctype html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
<title>纯CSS3打造炫酷的飞机和轮船动画特效</title>
<link rel="stylesheet" type="text/css" href="css/plane-normalize.css" />
<link rel="stylesheet" type="text/css" href="css/plane-default.css">
<link rel="stylesheet" type="text/css" href="css/plane-ship.css">

</head>
<body>

<div class="htmleaf-demo center">
	<a href="plane1.html" class="current">ship</a>
	<a href="plane2.html">plane</a>
</div>

<div class="boat">
	<div class="wrap">
		<div class="main">
			<div class="boat-top-layer">
				<div class="top">
					<div class="pole"></div>
					<div class="help"><span></span></div>
				</div>
				<div class="bottom"></div>
			</div>
			<div class="boat-mid-layer">
				<div class="top"></div>
				<div class="bottom"></div>
			</div>
			<div class="boat-bot-layer">
				<div class="top"></div>
				<div class="bottom"></div>
			</div>
		</div>
	</div>
	<div class="water">
		<div class="drops clearfix drops-1">
			<span class="drop drop-a"></span>
			<span class="drop drop-b"></span>
			<span class="drop drop-c"></span>
			<span class="drop drop-d"></span>
			<span class="drop drop-e"></span>
			<span class="drop drop-f"></span>
			<span class="drop drop-g"></span>
			<span class="drop drop-h"></span>
		</div>
		<div class="drops clearfix drops-2">
			<span class="drop drop-a"></span>
			<span class="drop drop-b"></span>
			<span class="drop drop-c"></span>
			<span class="drop drop-d"></span>
			<span class="drop drop-e"></span>
			<span class="drop drop-f"></span>
			<span class="drop drop-g"></span>
			<span class="drop drop-h"></span>
		</div>
	</div>
</div>
</body>
</html>